<template>
  <div>
    <el-form ref="optForm" :model="form" label-width="90px">
      <div class="ledgerTitle">基本信息</div>
      <el-row :gutter="10">
        <el-col :span="8">
          <el-form-item label="工作年度:" prop="planHeadYear">
            {{form.planHeadYear}}
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label-width="140px" label="编制人:" prop="compiler">
            {{form.compiler}}
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="编制日期:" prop="planHeadDate">
            {{form.planHeadDate}}
          </el-form-item>
        </el-col>
      </el-row>
      <div class="ledgerTitle">计划明细</div>
      <div v-for="(item, idx) in form.plans" :key="idx" style="margin-bottom: 20px">
        <el-row>
          <el-col :span="8">
            <el-form-item label-width="100px" label="计划名称:" :prop="`plans.${idx}.planName`">
              {{item.planName}}
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label-width="100px" label="审计类型:" :prop="`plans.${idx}.auditType`">
              <DictTag :options="dict.type.audit_type" :value="item.auditType"></DictTag>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
            <el-form-item label-width="100px" label="被审计单位:" :prop="`plans.${idx}.auditedCompanyId`">
              {{item.auditedCompanyName}}
            </el-form-item>
          </el-col>
          <el-col :span="16">
            <el-form-item label-width="100px" label="审计区间:" :prop="`plans.${idx}.auditDates`">
              <span v-if="item.auditStartDate" style="margin-right: 5px;">{{ item.auditStartDate }} 至</span>
              <span style="margin-left: 5px;">{{ item.auditEndDate }}</span>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
            <el-form-item label-width="100px" label="被审计个人:" :prop="`plans.${idx}.auditedUserId`">
              {{item.auditedUserNames}}
            </el-form-item>
          </el-col>
          <el-col :span="16">
            <el-form-item label-width="100px" label="计划时间:" :prop="`plans.${idx}.planDates`">
              <span v-if="item.planStartDate" style="margin-right: 5px;">{{ item.planStartDate }} 至</span>
              <span style="margin-left: 5px;">{{ item.planEndDate }}</span>
            </el-form-item>
          </el-col>
        </el-row>
      </div>
    </el-form>
  </div>
</template>
<script>

import {getObj} from "@/api/adis/work/planHead";

export default {
  name: 'PlanHeadAuditView',
  props: {
    id: {
      type: String,
      default: '',
    },
    params: {
      type: Object,
    },
    isAudit: {
      type: Boolean,
      default: false,
    }
  },
  components: {},
  dictTypes: ['audit_type'],
  data() {
    return {
      form: {},
    }
  },
  watch: {
    id: {
      handler(val){
        if (val){
          getObj(val).then((res) => {
            if (res.data.data !== null){
              this.form = res.data.data;
              this.$emit('data-loaded', true);
            } else {
              this.$emit('data-loaded', false);
            }
          }).catch(() => {
            this.$emit('data-loaded', false);
          });
        }
      },deep: true, immediate: true
    },
    params: {
      handler(val) {
        if (val){
          this.form = val;
        }
      },deep: true, immediate: true
    },
  },
}
</script>
